#archive-flex
  width 100%
  height fit-content
  min-height 600px
  box-sizing border-box
  display flex
  justify-content stretch
  position: relative

#archive-aside
  &::-webkit-scrollbar
    display none
  &::-ms-scrollbar
    display none
  scrollbar-width none
  padding-bottom 30px
  overflow auto
  box-sizing border-box
  padding-top 10px
  top 0
  height fit-content
  @media ( min-width 769px )
    max-height 100vh
  display flex
  flex-grow 1
  flex-direction column

#Archives, #Categories, #Tags
  margin 0 10px
  background-color var(--theme-bg-trans1)
  overflow-y auto
  &, h1
    transition .3s
  h1
    margin 0
    padding 0 15px
    color var(--theme-text-rev)
    background-color var(--theme-bg-light)
    font-size medium
    font-family BenderLight
  @media ( min-width 769px )
    &:hover, &:target
      background-color var(--theme-bg-trans2)
      h1
        background-color var(--theme-highlight)

#Archives
  margin-bottom 30px
  margin-top 10px
  @media ( min-width 769px )
    min-height calc(100vh - 40px)
  flex-grow 5
  position relative
  h2
    margin 10px 0
    font-size large
    &:before
      content ''
      display inline-block
      width 5px
      height 15px
      margin-right 5px
      background-color var(--theme-subcolor)
  time
    color var(--theme-text-light)
.categories, .tags
  display inline-block
#Archives-bg
  box-sizing border-box
  padding 10px
  padding-bottom 30px

.article-item
  padding-inline 20px
  display flex
  position relative
  margin-bottom 15px
  &::after
    content ''
    width calc(100% - 30px)
    position absolute
    display block
    bottom -5px
    left 15px
    border-bottom: 1px var(--theme-unimportant-trans) solid

#Categories
  height fit-content
  overflow visible
  height 50%
  flex-grow 1
  margin-bottom 20px
  p
    text-align center

#Tags
  height fit-content
  overflow visible
  height 100%
  flex-grow 1
  p
    text-align center

#navigation a
  width 100%
  display inline-block
  padding 6px 0
  font-size x-large
  font-weight 900
  font-family BenderLight
  text-align center

.control-archive
  width 55px
  display inline-block
  & + a
    width calc(100% - 55px)
